<!DOCTYPE html>
<html>
<head>
    {include file='public/meta'/}
    <style>
        thead tr th {
            text-align: center;
        }

        tbody tr td {
            text-align: center;
        }
        div.form-inline{
            border: 1px solid #ccc;
            padding: 5px 15px;
            box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
            -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
        }
        .gift-record select,.gift-record input{
            display: inline-block;
            width: 44%;
            float: left;
        }
        .reco{
            margin-bottom:10px;
        }
        .gift-record input{
            margin-left:5px;
        }
        .form-control {
            background-color: #FFFFFF;
            border: 1px solid #E3E3E3;
            border-radius: 4px;
            color: #565656;
            padding: 7px 12px;
            font-size: 12px;
            height: 38px;
            max-width: 100%;
            -webkit-box-shadow: none;
            box-shadow: none;
            -webkit-transition: all 300ms linear;
            -moz-transition: all 300ms linear;
            -o-transition: all 300ms linear;
            -ms-transition: all 300ms linear;
            transition: all 300ms linear;
        }
        .addcord{
            padding: 0;
            margin-top: 5px;
        }
        .form1 a{
            color: #2db7f5;
            line-height: 35px;
            display: inline-block;
            margin: 0 5px;
        }
    </style>
</head>
<body>
{include file='public/header'/}
<!------------------导航-------------------------->
<section id="content">
    {include file='public/left'/}
    <!--------------------------主要内容区域------------------------------------->
    <div class="content">
        <div class="page-heading mgl15 mgr15">
            <ol class="breadcrumb">
                <li><a href="#">充值中心</a></li>
                <li class="active">修改面额</li>
            </ol>
        </div>
        <div class="panel panel-default mgl15 mgr15">
            <form class="form-horizontal" action="" method="post"onsubmit="return check()" >
            <div class="panel-body">
                    <div class="form-group">
                        <label class="col-sm-2 control-label ng-binding">充值额度</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" name="cz_money" autocomplete="off"
                                   placeholder="" value="{$info.cz_money}" required="required">
                            <div class="r-message text-danger ng-scope ng-inactive"></div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label ng-binding">赠送额度</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" name="zs_money" autocomplete="off" placeholder=""
                                   value="{$info.zs_money}" required="required">
                            <div class="r-message text-danger ng-scope ng-inactive"></div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label ng-binding">每人限购数量</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" name="limit_sume" autocomplete="off" placeholder=""
                                   value="{$info.limit_sume}" required="required">
                            <div ng-if="property.desc" class="r-desc ng-binding ng-scope" ng-bind-html="property.desc | to_trusted">为0时表示不限制</div>
                        </div>
                    </div>

                <div class="form-group ">
                    <label class="col-xs-12 col-sm-3 col-md-2 control-label "><span class="text-danger">*</span> 选择要赠送的卡券</label>
                    <div class="col-xs-10 col-sm-10 col-md-10 form1">
                        <a href="javascript:;" onclick="addsele(this)" style="color: #2db7f5;" data-counts="1" id="datacount">添加赠送</a>

                        <div class="col-xs-12 col-sm-12 col-md-12 addcord"id="sel1">
                            {volist name="zs_card_id_all" id="zsvo"}
                        <div class="gift-record reco">

                            <select name="card_arr[zs_card_id][]"  class="form-control" onchange="select(this)" >
                                <option value="">--请选择--</option>
                                {volist name="cards" id="vos"}
                                <option value="{$vos.card_id}" data-title="{$vos.title}" data-limit="{$vos.get_limit}"{eq name="$zsvo['zs_card_id']" value="$vos['card_id']"}selected{/eq}>{$vos.title}( 最大可选卡券数量为{$vos.get_limit} )</option>
                                {/volist}
                            </select>

                            <input type="number" class="form-control"min="1" placeholder="请填写" value="{$zsvo['zs_no']}" name="card_arr[zs_no][]">
                            <a href="javascript:;" onclick="delsel(this)">删除</a>
                        </div>

                            {/volist}
                            </div>


                    </div>
                </div>

                

                    <div class="form-group">
                        <label class="col-sm-2 control-label ng-binding">积分</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" name="bonus" autocomplete="off" placeholder=""
                                   value="{$info.bonus}" required="required">
                            <div ng-if="property.desc" class="r-desc ng-binding ng-scope" ng-bind-html="property.desc | to_trusted">充值赠送对应的积分如:100则赠送100积分,可以为0</div>
                        </div>
                    </div>
                <div class="form-group">
                    <label class="col-sm-2 control-label ng-binding">描述说明：</label>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" name="zs_show" value="{$info.zs_show}">
                        <div ng-if="property.desc" class="r-desc ng-binding ng-scope" ng-bind-html="property.desc | to_trusted">充值描述</div>
                    </div>
                </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label ng-binding">状态</label>
                        <div class="col-sm-10">
                            <select name="statu" id="" class="form-control">
                                <option value="">--请选择--</option>
                                <option value="1"  {eq name="info.statu" value="1" }selected{/eq}>开启</option>
                                <option value="2" {eq name="info.statu" value="2" }selected{/eq}>关闭</option>
                            </select>
                            <div class="r-message text-danger ng-scope ng-inactive"></div>
                        </div>
                    </div>

            </div>
            <div class="panel-footer">
                <button class="btn btn-success" type="submit">保存</button>
            </div>
            </form>
        </div>
        {include file='public/footer'/}
    </div>
</section>
<script>
    $(function(){
        //        页面加载完毕 门店显示为选中状态 开始
        var mid = "{$info.zs_card_id}";
        var checkbox = $(".checkmid").length;
        var arr = mid.split(",");
        console.log(mid)
        for(var j= 0 ;j<arr.length;j++){
            for(var i=0;i<checkbox;i++){
                var checkval= $(".checkmid").eq(i).val();
                if(arr[j]==checkval){
                    $(".checkmid").eq(i).attr("checked","checked")
                }
            }
        }
    })
</script>
<script>
    function select(obj){
        limit=$("option:selected").attr("data-limit");

        $(obj).siblings("input").attr("max",limit);
console.log($(obj));
        console.log(333333,limit);
    }








</script>
<script>
    function addsele(obj){

        datacount=$(obj).attr('data-counts');
        console.log(datacount);
        get_limit=parseInt($("#sel"+datacount).find("option:selected").attr("data-limit"));
        num=parseInt($("#sel"+datacount).find("input").val());
        val=$("#sel"+datacount).find("option:selected").val();

        if( $("#sel"+datacount).find("option:selected").val()==""){
            alert("卡券选项不能为空");
            return;
        }else if(num>get_limit){

            alert("你选择的卡券数量超过了该卡券的领取数量!");
            return;
        }else{

            datacount2=parseInt(datacount)+1;
            $(obj).attr('data-counts',datacount2);
            html= '                        <div class="col-xs-12 col-sm-12 col-md-12 addcord" id="sel'+datacount2+'">\n' +
                '                            <div class="gift-record">\n' +
                '                                <select name="card_arr[zs_card_id][]"  class="form-control" >\n' +
                '                                    <option value="">--请选择--</option>\n' +
                '                                    {volist name="cards" id="vos"}\n' +
                '                                    <option value="{$vos.card_id}" data-limit="{$vos.get_limit}" data-title="{$vos.title}">{$vos.title}  ( 最大可选卡券数量为 {$vos.get_limit}  )</option>\n' +
                '                                    {/volist}\n' +
                '                                </select>\n' +
                '\n' +
                '                                <input type="number" class="form-control"min="1"placeholder="请填写"value="1"name="card_arr[zs_no][]">\n' +
                '                            </div>\n' +
                '                             <a href="javascript:;" onclick="delsel(this)">删除</a>\n' +
                '                    </div>';
            $('.form1').append(html);

            $("#sel"+datacount2).find("select").change(function(){

                limit=$("#sel"+datacount2).find("option:selected").attr("data-limit");
                $("#sel"+datacount2).find("input").attr("max",limit);



            });


        }

    }
</script>
<script>
    function check(){
        var items = document.getElementsByTagName('select'),
            len = items.length,
            i = 0,
            valMap = {},
            sel,
            val;

        // 遍历并保存各个下拉列表的值于valMap
        for(; i < len; i++){
            sel = items[i];
            val = sel.options[sel.selectedIndex].value;

            // 没有相同的取值时保存该值，否则返回false
            if(!valMap[val]){
                valMap[val] = 1;
            }else{
                alert('请删除重复的卡券！');
                return false;
            }
            if($("#sel1").find("option:selected").val()==""){
                alert("请选择卡券！");
                return false;
            }
        }

        // 校验通过，全部都不相同
        return true;

    }

</script>
<script>

    function delsel(obj){
//
        $(obj).parent().remove();


    }

</script>
</body>

</html>
